<html>
	<head>
	<title>
		Camera Roll Home
	</title>
	<link href="css/bootstrap.css" rel="stylesheet"> 
	<style>
		body {
			padding-top: 60px; /* 60px to make the container go all the way to the bottom of the topbar */
		}
	</style> 
	<link href="css/bootstrap-responsive.css" rel="stylesheet"> 
	<link href="css/smoothness/jquery-ui-1.9.1.custom.css" rel="stylesheet">
	<link href="css/cameraRoll.css" rel="stylesheet">
	
	<script type="text/javascript" src="http://code.jquery.com/jquery-latest.js"></script>
	<script type="text/javascript" src="js/bootstrap.js"></script>
	<script type="text/javascript" src="js/jquery-ui-1.9.1.custom.js"></script>
	<script type="text/javascript" src="js/cameraRoll.js"></script>
	
	<!--Signout scrip-->
	<script>
		$(document).ready (function() {
			$("#signOut a").click(function(event) {
				event.preventDefault();
				$.get("./cameraRollPhp/logout.php", function(data) {
					location.reload();
				});
			});
		});
	</script>
	
</head>

<body>

	<!--Navbar-->
	<div id="header" class="navbar navbar-fixed-top">
		<div class="navbar-inner">
			<div class="container">		
				<a class="btn btn-navbar" data-toggle="collapse" data-target=".nav-collapse">
				        <span class="icon-bar"></span>
				        <span class="icon-bar"></span>
				        <span class="icon-bar"></span>
				</a>
				
				<!--Brand image-->
				<a id="brand" class="brand" href="./" style="font-family: Copperplate">
					<img class="brandImage" src="./images/longShortCameraRoll.png">	
				</a>
			<div class="nav-collapse">
				<ul id="navlist" class="nav">
				
					<!--Return to user home page-->
					<li id="home" class="active">
						<a href="./" style="font-family: Impact">Home</a>
					</li>

					<!--Account as dropdown list-->
					<li class="dropdown">
						<a id="account" href="#" role="button" class="dropdown-toggle" data-toggle="dropdown" style="font-family: Impact">Account</a>
							<ul class="dropdown-menu" role="menu" aria-labelledby="account">
								<li>
									<a href="./manageProfile.php">Manage Profile</a>
								</li>
								<li>
									<a href="./changePassword.php">Change Password</a>
								</li>
								<li>
									<a href="./changeEmail.php">Change Email</a>
								</li>
							</ul>
					</li>

					<!--Sign out-->
					<li id="signOut">
						<a href="./signOut.html" style="font-family: Impact">Sign Out</a>
					</li>
				</ul>
			</div>
			</div>	
		</div>
	</div>


	<!--Sidebar-->
	<div id="sideBar" class="span2">
		<h4>
			Photos
		</h4>
		<ul>
			<li>
				<a href="./upload.php">Upload</a>
			</li>
			<li>
				<a href="./viewAll.php">View All</a>
			</li>
		</ul>
		<br />	
		<h4>
			Albums
		</h4>
		<ul>
			<li>
				<span style="color:red">Create</span>
			</li>
			<li>
				<a href="./viewAlbums.php">View Albums</a>
			</li>
		</ul>	
	</div>

	<!--Main body-->
	<div id="mainPage" class="span10">
		<h1 style="font-family: Comic Sans">
			Create Album
		</h1>
	<br />
	<h2>Popup box?</h2>
	</body>
</html>
